
.login {
    -webkit-app-region:drag;
    height: 100%;
    width: 100%;
    padding: 0 ;
    .login-view {
        position: relative;
        margin-top: 0px;
        height: 372px;
        -webkit-app-region: no-drag;
    }

    display: flex;
    flex   : 1;
    height : 100%;

    .title {
        margin-bottom: 40px;
        font-size    : 24px;
        font-weight: 500;
        // position: relative;
        // top: 70px;
        // right: 30px;
        // z-index: 100;
    }
    .login-banner {
        height   : 100%;
        max-width: 100%;
    }

    .form-wraper {
        display        : flex;
        flex           : 1;
        align-items    : center;
        justify-content: center;
        flex-direction : column;
        // *{
        //     font-family: ali-font !important;
        // }
    }

    .ant-form-item-label>label {
        color: #C8CAD0;

        &::before {
            content: ''
        }
    }

    .edit-wraper {
        display        : flex;
        justify-content: space-between;
        align-items    : center;
        -webkit-app-region:no-drag;
        .login-form-forgot{
            // right: -216px;
            position: relative;
            color: #969ba5;
        }
      
        .login-button {
            width           : 156px;
            height          : 40px;
            background-color: #3468F5;
            box-shadow      : 0px 5px 16px -3px rgba(52, 104, 245, 0.69);
        }

        .sub-text {
            color    : #969BA5;
            font-size: 14px;

            a {
                color: #111;
            }
        }
    }

    input {
        outline   : none;
        box-shadow: none;
        border    : none;
        background: #F5F6FA !important;
        // color     : #2C2F36 !important;
        color: #222222!important;
    }
    input ,a ,button{
        -webkit-app-region:no-drag;
    }

    
    input:focus {
        box-shadow: 0 0 0 1px rgba(66, 66, 66, 0.2);
    }
    .ant-input-group-wrapper
    {
        -webkit-app-region:no-drag;
    }
    .ant-input-group-addon:first-child .ant-select .ant-select-selection {
        // border      : none;
        background  : #F5F6FA;
        // color       : #2C2F36;
        color: #222222;
        border-right: 1px solid #e2e2e2;
    }

    .qrco-img {
       
        height   : 66px;
        max-width: 66px;
        position : absolute;
        right    : 0px;
        top      : -66px;
        -webkit-app-region: no-drag; 

        &:hover {
            cursor: pointer;
        }
    }

    .ant-form-vertical .ant-form-item {
        padding-bottom: 0;
        margin-bottom: 20px;
    }
}

button {  
    -webkit-app-region: no-drag; 
}

input{
    -webkit-app-region:no-drag;
}

.regeister {
    .login-button {
        margin-right: 8px;
    }
}

.ant-form-item{
    width: 316px;
  
}



 .right_ma{
    
    -webkit-app-region:no-drag;
   position: relative;
   top: 17%;
  
 }
 .qr-img{
    width: 45px;
    height: 44px;
    position: relative;
    /* left: 0px; */
    right: -124px;
    margin-bottom: 20px;
}
 .login-banner,.qrconde-content{
   // float: left;
   display:inline-block
   
 }
 .login-banner{
   width:50%;
   // border-right:1px solid #f00
 }
 .qrconde-content{
   text-align: center;
   width:100%;
   .ma {
    height: 300px;
    background: #ffffff !important;
    padding: 10px 10px;
    margin-bottom: 14px;
    display: inline-flex;
    position: relative;
    .qrcode{
    text-align: -webkit-center;
     width: 300px;
     height:300px;
     h2{
         margin-top: 30px;
     }

    }
        .outle {
            text-align: -webkit-center;
            width: 300px;
            height:300px;
            z-index: 99;
            top: 0;
            bottom: 0;
            background: #e8e8e8de;
            position: absolute;
            display: flex;
            align-items: center;
            justify-content: center;
          }
          .refresh{
              color: #0093ff;
              cursor: pointer;
              &:hover{
                  opacity: .5;
              }
              &:active{
                color: #2781c3;
              }
          
    
         }
      
    
   }
 
}
.add-screen-wrap{
    display: none;
    background: #00a1f7;
    position: absolute;
    bottom: 16px;
    left: 4px;
    right: 4px;
    height: 56px;
    display: flex;
    .left{
        display: flex;
        flex: 1 1;
        align-items: center;
        padding: 0 4px;
        color: #e9eef1;
    }
    .right{
        width: 80px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    button{
        background-color: #00a1f7;
        border: 1px solid #7fbae6;
        outline: none;
        color: #f0f0f0;
        padding: 4px 8px;
        border-radius: 4px;
        font-size: 12px;
        cursor: pointer;
    }
    &:after{
        content: ' ';
        background-color: #00a1f7;
        width: 12px;
        height: 12px;
        border-radius: 4px;
        position: absolute;
        bottom: -4px;
        left: 50%;
        transform: rotate(45deg);
        z-index: 0;
    }
}
 
.wechat-item{
    text-align: center;
    margin-top: 40px;
    .wechat-icon{
        -webkit-app-region: no-drag;
        color: #52c41a;
        font-size: 35px;
    }
}
.node-switch{
    position: relative;
    left: 0px;
    top: -33px;
    -webkit-app-region: no-drag;
    .switch{
        
        background-color: #1890ff;
    }
}
